<template>
  <div class="analyse-content-container analyse-page-container">
    <div v-if="config.tagId" v-loading="loading" class="analyse-content-wrap">
      <div class="analyse-title">
        <h2><icon-svg name="iconResTeam"></icon-svg>{{ config.funnelAnalysisName }}</h2>
        <div class="analyse-handler clearfix">
          <template v-if="type === 'mine'">
            <span class="release-tips" v-if="config.isRelease === 2">发布审核中</span>
            <el-button size="mini" @click="hendleRun">
              <icon-svg name="iconExport"></icon-svg>
              重新运行
            </el-button>
            <el-button size="mini" @click="handleEdit" :class="{ disabled: config.isRelease === 2 }">
              <icon-svg name="iconFacEdit"></icon-svg>
              编辑
            </el-button>
          </template>
          <el-button size="mini" @click="handleCopy">
            <icon-svg name="iconCopy"></icon-svg>
            复制
          </el-button>
          <template v-if="type === 'mine'">
            <el-button size="mini" @click="handleMove">
              <icon-svg name="iconMove"></icon-svg>
              移动
            </el-button>
            <el-button size="mini" @click="handleRelease(false)">
              <icon-svg :name="config.isRelease ? 'iconRedo' : 'iconRelease'"></icon-svg>
              {{ config.isRelease ? '取消发布' : '发布' }}
            </el-button>
          </template>
          <el-button size="mini" @click="handleRelease(true)">
            <icon-svg name="iconInfoCheck"></icon-svg>
            重新发布
          </el-button>
          <el-button size="mini" v-if="type === 'mine'" @click="handleDelete">
            <icon-svg name="iconDelete"></icon-svg>
            删除
          </el-button>
          <!-- <el-dropdown>
            <span>更多操作 </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item> <icon-svg name="iconGroup"></icon-svg> 复制 </el-dropdown-item>
              <el-dropdown-item>
                <icon-svg name="iconDelete"></icon-svg>
                删除
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown> -->
        </div>
      </div>
      <funnel-info ref="funnelInfo" :info="config" v-if="config.tagId"></funnel-info>
    </div>
    <div class="no-record" v-else>
      <template v-if="!config.tagId && !loading">
        <img src="~@/assets/img/no_records.png" /><br />
        暂无内容
      </template>
    </div>
    <funnel-dialog ref="funnelDialog" @callback="$emit('callback')"></funnel-dialog>
  </div>
</template>

<script>
import funnelInfo from './funnel-information'
import funnelDialog from './funnel-operation-dialog'
export default {
  components: {
    funnelInfo,
    funnelDialog
  },
  props: {
    config: {
      type: Object,
      required: true,
      default: () => {}
    },
    type: {
      default: 'mine'
    }
  },
  data() {
    return {
      loading: true
    }
  },
  methods: {
    handleEdit() {
      if (this.config.isRelease == 2) {
        this.$message.info('分析正在审核中！')
        return
      }
      this.$router.push({ name: 'funnel-config', query: { tagId: this.config.tagId } })
    },
    handleDelete() {
      this.$confirm(`确定删除【${this.config.funnelAnalysisName}】？`).then(() => {
        let messageBox = document.getElementsByClassName('el-message-box__wrapper')
        messageBox[0].focus() // 防止按空格键重复确定
        this.loading = true
        this.$ajax({
          url: this.$ajax.setUrl(`funnelAnalysis/deleteFunnelInfo/${this.config.tagId}`),
          method: 'delete',
          params: this.$ajax.setParams()
        }).then(({ data }) => {
          if (data && data.code === '0') {
            this.$emit('deleteFunnel')
            this.$message.success(data.msg)
          } else {
            this.$message.error(data.data || data.msg)
          }
          this.loading = false
        })
      })
    },
    handleMove() {
      this.$refs.funnelDialog.showDialog({
        tagId: this.config.tagId,
        type: 'move'
      })
    },
    handleCopy() {
      this.$refs.funnelDialog.showDialog({
        tagId: this.config.tagId,
        type: 'copy'
      })
    },
    handleRelease(isAggain = false) {
      this.$confirm(
        `确定${isAggain ? '重新发布' : this.config.isRelease ? '取消发布' : '发布'}【${
          this.config.funnelAnalysisName
        }】？`
      ).then(() => {
        let messageBox = document.getElementsByClassName('el-message-box__wrapper')
        messageBox[0].focus() // 防止按空格键重复确定
        this.$utils
          .release(this.config.tagId, '30', isAggain || !this.config.isRelease ? 'post' : 'delete', isAggain)
          .then(data => {
            this.$message.success(data.msg)
            this.$emit('callback')
          })
          .catch(data => {
            this.$message.error(data.data || data.msg)
          })
      })
    },
    hendleRun() {
      this.loading = true
      this.$ajax({
        url: this.$ajax.setUrl(`funnelAnalysis/restartTag/${this.config.tagId}`),
        method: 'get',
        params: this.$ajax.setParams()
      }).then(({ data }) => {
        if (data && data.code === '0') {
          this.$message.success(data.msg)
          this.$emit('callback')
        } else {
          this.$message.error(data.data || data.msg)
        }
        this.loading = false
      })
    }
  }
}
</script>

<style lang="scss"></style>
